<div class="error-container">
  <perf-view></perf-view>

  <stbui-search placeholder="输入过滤条件"></stbui-search>

  <div class="error-main mat-elevation-z2">
    <div class="error-toolbar" fxLayout="row" fxLayoutAlign="start center">
      <div class="start-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex>
        <span>资源地址</span>
      </div>
      <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="240px">
        <span>响应时间</span>
      </div>
      <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="120px">
        <span>DNS时间</span>
      </div>
      <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="120px">
        <span>资源加载时间</span>
      </div>

      <div class="end-wrapper" fxLayout="row" fxLayoutAlign="end center" fxFlex="80px">
        <span>白屏时间</span>
      </div>

    </div>

    <div class="error-list">
      <div class="error" fxLayout="row" *ngFor="let data of data.datas" (click)="onDetailTriggered(data)">
        <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex>
          <span><a class="link" target="blank" [href]="data.url">{{ data.url }}</a></span>
        </div>

        <div class="start-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="240px">
          <span>{{ data.response }}</span>
        </div>

        <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="120px">
          <span>{{ data.dns }}</span>
        </div>

        <div class="content-wrapper" fxLayout="row" fxLayoutAlign="start center" fxFlex="120px">
          <span>{{ data.load }}</span>
        </div>

        <div class="end-wrapper" fxLayout="row" fxLayoutAlign="end center" fxFlex="80px">
          <span>{{ data.black_waiting_time }}</span>
        </div>
      </div>
    </div>

  </div>
</div>
